<template>
  <div style="padding: 10px">
    <el-card>
      <div id="myChart" :style="{width: '800px', height: '600px'}"></div>
    </el-card>
  </div>
</template>

<script>
import request from "@/utils/request";

export default {
  name: "Itempage2",
  data() {
    return {}
  },
  mounted() {
    this.drawLine();
  },
  methods: {
    drawLine() {
      // 基于准备好的dom，初始化echarts实例
      let myChart = this.$root.echarts.init(document.getElementById('myChart'))
      var option = {
        title: {
          text: '不同材质对比'
        },
        legend: {
          data: ['医疗塑料', '金属']
        },
        radar: {
          indicator: [
            { name: '硬度', max: 6500 },
            { name: '成本', max: 16000 },
            { name: '加工难度', max: 30000 },
            { name: '原材料获取难度', max: 30000 },
            { name: '应用广泛度', max: 52000 },
            { name: '价格', max: 25000 }
          ]
        },
        series: [
          {
            name: '医疗塑料 vs 金属',
            type: 'radar',
            data: [
              {
                value: [3200, 3000, 5000, 5000, 50000, 8000],
                name: '医疗塑料'
              },
              {
                value: [5000, 1000, 18000, 20000, 42000, 21000],
                name: '金属'
              }
            ]
          }
        ]
      }

        // 绘制图表
        myChart.setOption(option);

    }
  }
}
</script>

<style scoped>

</style>